<template>
  <l-dialog
    title="数据表选择"
    width="800px"
    :height="600"
    :visible.sync="midVisible"
    :hasBtns="multiple"
    @close="closeDialog"
    @opened="handleOpened"
    @ok="okDialog"
  >
    <l-select-panel
      style="padding:8px;"
      ref="selectPanel"
      :isRefresh="true"
      :columns="columns"
      :isPage="true"
      :loadSelectTable="loadSelectTable"
      :refreshData="refreshData"
      :multiple="multiple"
      model="client"
      valueKey="name"
      @rowClick="handleRowClick"
    >
    </l-select-panel>
  </l-dialog>
</template>

<script>
const api = window.$api.data.dbTable;
export default {
  name: "l-dbtable-selectdialog",
  props: {
    visible: {
      type: Boolean,
    },
    dbCode: String,
    multiple: {
      type: Boolean,
      default: true,
    },
    isOkClose: {
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      columns: [
        { label: "表名", prop: "name", minWidth: "120" },
        { label: "说明", prop: "description", minWidth: "120" },
        //{label:'类型',prop:'type',width:'100',align:'center'}
      ],
      dbList: {},
    };
  },
  created() {},
  mounted() {},
  computed: {
    midVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
  },
  methods: {
    refreshData() {
      if (this.dbCode) {
        this.dbList[this.dbCode] = null;
      }
      this.$refs.selectPanel.init();
    },
    async loadSelectTable() {
      if(this.dbCode && this.dbList[this.dbCode] == null){
        this.dbList[this.dbCode] = await this.$awaitWraper(api.getList(this.dbCode))
        return this.dbList[this.dbCode] || [];
      }
      else if(this.dbCode){
        return this.dbList[this.dbCode] || [];
      }
      else{
        return []
      }
    },
    closeDialog() {
      this.$refs.selectPanel.reset();
    },
    handleOpened() {
      this.$refs.selectPanel.init();
    },
    loadData() {
      this.$refs.selectPanel.init();
    },
    async okDialog(showLoading, hideLoading) {
      let select =  await this.$refs.selectPanel.getSelected();
      this.$emit("select", select, showLoading, hideLoading);
      if (this.isOkClose) {
        this.midVisible = false;
      }
    },
    async handleRowClick() {
      if (!this.multiple) {
        let select =  await this.$refs.selectPanel.getSelected();
        this.$emit("select", select);
        if (this.isOkClose) {
          this.midVisible = false;
        }
      }
    },
  },
};
</script>
